'use strict';
import React, {Component, PropTypes} from 'react';
import './style.less';
import PannelItem from './PannelItem.jsx';

export default class ComponentBox extends Component {
    constructor( props ) {
        super( props );
    }
    render(){
        let {row} = this.props;
        let style = {};
        if(!row.pic){
            style.backgroundColor = "#f7f7f7"
        }
        return (
                <td>
                    <div className="group">
                        <div className="left">
                            {row.products.map((item,j)=>{
                                if(item.title){
                                    return (
                                        <PannelItem key={j} item={item} onSelectProductItem={this.props.onSelectProductItem}/>
                                    )
                                }
                            })}
                        </div>
                        <div className="right">
                            <div className="img" style={style} >
                                {
                                    row.pic ?
                                        <img src={row.pic} alt=""/>
                                        :null
                                }
                            </div>
                        </div>
                    </div>
                </td>
        )
    }
}